<template>
  <div class="select-container">
    <div class="select-box">
      <span class="go-order" @click="goToOder">点餐</span>
      <span class="history-order" @click="seeHistory">历史订单</span>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src

export default {
  name: 'select',
  components: {},
  methods: {
    goToOder(){
      this.$router.push({ path: '/main'})
    },
    seeHistory(){
      this.$router.push({ path:'/mine'})
    }
  }
}
</script>
<style lang="less" scoped>
.select-container {
  height: 100vh;
  background-color: #f5ebdc;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  .select-box {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 60%;
    span {
      width: 40%;
      height: 40vh;
      line-height: 40vh;
      text-align: center;
      font-size:30px;
      font-weight:bold;
      color:rgba(255, 255, 255, 0.884);
      background-color: #ff8732;
      border-radius:30px;
         &:hover {
           opacity: .9;
           cursor: pointer;
         }
    }
  }
}
</style>
